uniapp封装各个时间方法

2023-03-24 11:04| 来源: 网络整理| 查看: 265

难点：在项目中我们经常会用到时间转换或时间比对加减问题

为了方便很多页面去调用时间方法，我把时间方法封装成了公共方法

1.首先在根目录创建文件夹与pages平级，我这里创建了plugins文件夹

2.其次在plugins文件夹下面创建index.js文件，这里引入需要挂载的全局封装的js方法

3.Conversiontime.js里面就是我自己封装的调用各个时间的方法

4.需要把我们创建的plugins文件夹全局挂载到main.js上

5.最后我们在用到的页面去调用这些方法即可(这里为了更好的演示，在onLoad()函数调用了这些方法）

看下详细代码

1.plugins文件下index.js挂载js代码

import tab from './tab' import auth from './auth' import modal from './modal' import conTime from './Conversiontime.js' export default { install(Vue) { // 页签操作 Vue.prototype.$tab = tab // 认证对象 Vue.prototype.$auth = auth // 模态框对象 Vue.prototype.$modal = modal // 时间对象 Vue.prototype.$conTime = conTime } }

2.在Conversiontime.js封装的时间方法代码

export default { // 获取时间 getTime() { return new Date(new Date().getTime() + (parseInt(new Date().getTimezoneOffset() / 60) + 8) * 3600 * 1000); }, //转换北京标准时间为标准日期格式时间 formatDate(d) { var date = new Date(d); var YY = date.getFullYear() + '-'; var MM = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-'; var DD = date.getDate() < 10 ? '0' + date.getDate() : date.getDate(); var hh = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':'; var mm = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':'; var ss = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds(); return YY + MM + DD + ' ' + hh + mm + ss; }, //比较同一天的两个时间大小, 是否 t1 > t2。如 11:30 和 10:00, 返回true compareTimeInSameDay(t1, t2) { let d = new Date() let ft1 = d.setHours(t1.split(":")[0], t1.split(":")[1]) let ft2 = d.setHours(t2.split(":")[0], t2.split(":")[1]) return ft1 > ft2 }, //判断时间是否为标砖的日期时间格式 JudgmentDate(time){ var reg = /^[1-9]\d{3}-(0[1-9]|1[0-2])-(0[1-9]|[1-2][0-9]|3[0-1])\s+(20|21|22|23|[0-1]\d):[0-5]\d:[0-5]\d$/; var regExp = new RegExp(reg); if (!regExp.test(time)) { console.log("登录时间格式不正确,正确格式为: 2000-01-01 12:00:00 "); return; } }, //判断日期，时间大小 compareTime(logintime, logouttime) { if (logintime.length > 0 && logouttime.length > 0) { var logintimeTemp = logintime.split(" "); var logouttimeTemp = logouttime.split(" "); var arrloginDate = logintimeTemp[0].split("-"); var arrlogoutDate = logouttimeTemp[0].split("-"); var arrloginTime = logintimeTemp[1].split(":"); var arrlogoutTime = logouttimeTemp[1].split(":"); var allLoginDate = new Date(arrloginDate[0], arrloginDate[1], arrloginDate[2], arrloginTime[0], arrloginTime[1], arrloginTime[2]); var allLogoutDate = new Date(arrlogoutDate[0], arrlogoutDate[1], arrlogoutDate[2], arrlogoutTime[0], arrlogoutTime[1], arrlogoutTime[2]); if (allLoginDate.getTime() >= allLogoutDate.getTime()) { console.log(allLoginDate.getTime(), allLogoutDate.getTime()) return false; } else { console.log(allLoginDate.getTime(), allLogoutDate.getTime()) return true; } } else { return false; } }, //比较日期大小 compareDate(startTime, endTime) { var arys1 = new Array(); var arys2 = new Array(); if (startTime != null && endTime != null) { arys1 = startTime.split('-'); var sDate = new Date(arys1[0], parseInt(arys1[1] - 1), arys1[2]); arys2 = endTime.split('-'); var eDate = new Date(arys2[0], parseInt(arys2[1] - 1), arys2[2]); if (sDate >= eDate) { return false; } else { return true; } } } }

3.把puligns文件全局挂载到main.js代码（vue2.0）

import Vue from 'vue' import App from './App' import store from './store' // store import plugins from './plugins' // plugins import './permission' // permission Vue.use(plugins) Vue.config.productionTip = false Vue.prototype.$store = store App.mpType = 'app' const app = new Vue({ ...App }) app.$mount()

4.用到的页面调用此方法代码（this.$conTime.方法名()）

onLoad() { let curTime = new Date();//获取当前时间 this.$conTime.JudgmentDate(curTime)//判断时间格式是否为标准日期格式 let newcurTime= this.$conTime.formatDate(curTime) //当前北京时间转换北京标准时间为标准日期格式时间 let noneTime = new Date(curTime.setSeconds(curTime.getSeconds() + 120));//图形验证码失效时间 let newnoneTime= this.$conTime.formatDate(noneTime)//失效后的图形验证码北京时间转换北京标准时间为标准日期格式时间 let compare=this.$conTime.compareTime(newcurTime,newnoneTime) //比较日期时间 console.log(compare,'比较') }

这样就大功告成了!!!

【本文地址】

公司简介

联系我们